
  {extend name="public/base"}
  {block name="x-body"}
  <style>
      .layui-form-item .layui-input-inline {
          width: 340px;
      }

      #test9 {
          display: none;
      }

      #demo1{
          width: 200px;
      }
  </style>
    <div class="x-body">
        <form class="layui-form">
            {if $id}
                <input type="hidden" name="id" value="{$id}">
            {/if}
            <div class="layui-form-item">
                <label for="ad_name" class="layui-form-label">
                    <span class="x-red">*</span>广告名称
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="ad_name" name="ad_name" required="" lay-verify="required"
                           autocomplete="off" class="layui-input" value="{$res.ad_name}">
                </div>
            </div>

            <div class="layui-form-item">
                <label for="ad_link" class="layui-form-label">
                    广告链接
                </label>
                <div class="layui-input-inline">
                    <input type="text" id="ad_link" name="ad_link"
                           autocomplete="off" class="layui-input" value="{$res.ad_link}">
                </div>
            </div>

          <div class="layui-form-item">
              <label class="layui-form-label">
                  <span class="x-red">*</span>广告位置
              </label>
              <div class="layui-input-inline">
                  <select name="position_id">
                      <option value="">请选择广告位置</option>
                      {volist name="position" id="v"}
                      <option value="{$v.id}" {eq name='v.id' value='$res.position_id'}selected{/eq}>{$v.position_name}</option>
                      {/volist}
                  </select>
              </div>
          </div>

            <div class="layui-upload layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>广告图片
                </label>
                <button type="button" class="layui-btn layui-btn-normal" id="test8">选择文件</button>
                <button type="button" class="layui-btn" id="test9">开始上传</button>
                <input type="hidden" name="ad_img" value="{$res.ad_img}" id="ad_img">

                <div class="layui-upload-list" style="display: {if !$res}none{/if};">
                    <label class="layui-form-label"></label>
                    <img class="layui-upload-img" id="demo1" src="{if $res}{:config('imgRoute')}{$res.ad_img}{/if}">
                    <p id="demoText"></p>
                </div>
            </div>

            <div class="layui-form-item">
                <label class="layui-form-label">
                    <span class="x-red">*</span>背景颜色
                </label>
                <div class="layui-input-inline" style="width: 302px;">
                    <input type="text" name="bgcolor" value="{$res.bgcolor}" placeholder="请选择颜色" class="layui-input" id="test-form-input">
                </div>
                <div class="layui-inline" style="left: -11px;">
                    <div id="test-form"></div>
                </div>
            </div>

          <div class="layui-form-item">
              <label for="L_repass" class="layui-form-label">
              </label>
              <button  class="layui-btn" lay-filter="edit" lay-submit="" id="L_repass">
                  {$id ? '修改' : '增加'}
              </button>
          </div>
      </form>
    </div>
    <script>
        $(function (){
            formData('{:url("ad/ad_form")}', 'edit', function (){
                parent.location.reload();
                // 获得frame索引
                var index = parent.layer.getFrameIndex(window.name);
                //关闭当前frame
                parent.layer.close(index);
            }, false);

            layui.use(['upload', 'colorpicker'], function(){
                var form = layui.form;

                var $ = layui.$,colorpicker = layui.colorpicker, upload = layui.upload;

                //表单赋值
                colorpicker.render({
                    elem: '#test-form'
                    ,color: '{$res.bgcolor}'
                    ,done: function(color){
                        $('#test-form-input').val(color);
                    }
                });

                var url = '{:url("ad_upload")}';

                uploadImg(upload, url);
            });
        })
    </script>
  {/block}